import {sizeConfig, typeConfig} from "@/views/main/dashboard/config";

/**
 * 地图配置
 */
export const options: any = {
    geo: {
        map      : "",
        center   : null,
        show     : true,
        zoom     : 1,
        roam     : true,
        label    : {
            show : true,
            color: "#939393",
        },
        itemStyle: {
            areaColor  : "#f8f2da",
            borderColor: "#a7a6a5",
            borderWidth: 1,
        },
        emphasis : {
            itemStyle: {
                areaColor  : "#e5ddc4",
                borderColor: "#969595",
            },
        },
        tooltip  : {
            show: false,
        },
    },

    legend   : [
        {
            left        : "0",
            top         : "bottom",
            selectedMode: false,
            orient      : "vertical",
            data        : [
                {name: "其他", icon: "circle"},
                {name: "游乐园", icon: "circle"},
                {name: "影视城", icon: "circle"},
                {name: "动漫城", icon: "circle"},
                {name: "景观园", icon: "circle"},
            ],
        },
        {
            left        : "106",
            bottom      : 90,
            selectedMode: false,
            orient      : "vertical",
            itemStyle   : {
                color      : "#fff",
                borderColor: "#000",
                borderWidth: "1",
            },
            itemHeight  : 5,
            data        : [
                {name: "其他（不足200亩）", icon: "circle"},
            ],
        },
        {
            left        : "104",
            bottom      : 60,
            selectedMode: false,
            orient      : "vertical",
            itemStyle   : {
                color      : "#fff",
                borderColor: "#000",
                borderWidth: "1",
            },
            itemHeight  : 10,
            data        : [
                {name: "中小型（200亩及以上，不足600亩）", icon: "circle"},
            ],
        },
        {
            left        : "102",
            bottom      : 30,
            selectedMode: false,
            orient      : "vertical",
            itemStyle   : {
                color      : "#fff",
                borderColor: "#000",
                borderWidth: "1",
            },
            itemHeight  : 15,
            data        : [
                {name: "大型（600亩及以上，不足2000亩）", icon: "circle"},
            ],
        },
        {
            left        : "100",
            bottom      : 0,
            selectedMode: false,
            orient      : "vertical",
            itemStyle   : {
                color      : "#fff",
                borderColor: "#000",
                borderWidth: "1",
            },
            itemHeight  : 20,
            data        : [
                {name: "特大型（2000亩及以上）", icon: "circle"},
            ],
        },
    ],
    tooltip  : {
        trigger: "item",
    },
    visualMap: {
        show       : true,
        min        : 0,
        max        : 500,
        top        : "top",
        seriesIndex: 0,
        text       : ["高", "低"],
        realtime   : false,
        calculable : true,
        inRange    : {
            color: ["#f8f2da", "#4af68f"],
        },
    },
    series   : [
        {
            type    : "map",
            map     : "",
            geoIndex: 0,
            name    : "地图热力",
            tooltip : {
                show     : true,
                formatter: (params: any) => {
                    return `地区:${params.data.name}<br>
                            数量:${params.data.value}<br>`
                },
                textStyle: {
                    align: "left", // 设置文字左对齐
                },
            },
            data    : [null],
        },
        // 地图上的散点
        {
            type            : "scatter",
            coordinateSystem: "geo",
            itemStyle       : {
                color      : ({data}: any) => {
                    return typeConfig[data.type]?.color || "#f00"
                },
                borderColor: "#111",
            },
            symbolSize      : (val: any, {data}: any) => {
                return sizeConfig[data.size]?.size || 5
            },
            tooltip         : {
                show     : true,
                formatter: (params: any) => {
                    return `名称:${params.data.name}<br>
                            类型:${params.data.type}<br>
                            规模:${params.data.size}<br>`
                },
                textStyle: {
                    align: "left", // 设置文字左对齐
                },
            },
            data            : [null],
        },
        {coordinateSystem: "geo", type: "scatter", name: "其他", itemStyle: {color: typeConfig["其他"].color}},
        {coordinateSystem: "geo", type: "scatter", name: "游乐园", itemStyle: {color: typeConfig["游乐园"].color}},
        {coordinateSystem: "geo", type: "scatter", name: "影视城", itemStyle: {color: typeConfig["影视城"].color}},
        {coordinateSystem: "geo", type: "scatter", name: "动漫城", itemStyle: {color: typeConfig["动漫城"].color}},
        {coordinateSystem: "geo", type: "scatter", name: "景观园", itemStyle: {color: typeConfig["景观园"].color}},
        {coordinateSystem: "geo", type: "scatter", name: "其他（不足200亩）"},
        {coordinateSystem: "geo", type: "scatter", name: "中小型（200亩及以上，不足600亩）"},
        {coordinateSystem: "geo", type: "scatter", name: "大型（600亩及以上，不足2000亩）"},
        {coordinateSystem: "geo", type: "scatter", name: "特大型（2000亩及以上）"},
    ],
}
